<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>画圆和胶囊按钮</title>
		<style type="text/css">
			div:nth-of-type(1){
				visibility: hidden;			/*隐藏元素，还占位置*/
				height: 50px;
				width: 50px;
				border: 1px solid #B000B0;
				border-radius: 50%;
			}
			.jiaoniang{
				height: 50px;
				width: 300px;
				border:1px solid #FFC0CB;
				border-radius: 25px;
				background-color: #FFC0CB;
				overflow: auto;				/*根据内容显示滚动条*/
			}
		</style>
	</head>
	<body>
		<div>
			
		</div>
		<div class="jiaoniang">
			你真帅啊你真帅啊你真帅啊你真帅啊你真帅啊你真帅啊你真帅啊你真帅啊你真帅啊你真帅啊你真帅啊你真帅啊你真帅啊你真帅啊你真帅啊你真帅啊你真帅啊
			你真帅啊你真帅啊你真帅啊你真帅啊你真帅啊你真帅啊你真帅啊你真帅啊你真帅啊你真帅啊你真帅啊你真帅啊你真帅啊你真帅啊你真帅啊你真帅啊
		</div>
	</body>
</html>
